<template>
  <div class="page">
    <button @click="addCount">+</button>
    {{count.count}}
    <button @click="minusCount">-</button>
    <hr />
    <button @click="addNumber">+</button>
    {{number.number}}
    <button @click="minusNumber">-</button>
  </div>
</template>

<script type="text/ecmascript-6">
import { mapState, mapActions } from "vuex";
export default {
  data() {
    return {};
  },
  computed: {
    ...mapState({
      //这里的...不是省略号了,是对象扩展符
      count: "Count",
      number: "Number"
    })
  },
  components: {},
  methods: {
    ...mapActions(["addCount", "minusCount", "addNumber", "minusNumber"])
  },
  mounted() {}
};
</script>

<style scoped>
</style>
